layui.define(function (exports) {
  "use strict";
  var $ = layui.jquery;

  var contextMenu = {
    init: function () {
      $(document)
        .off("click.rightMenu")
        .on("click.rightMenu", function () {
          contextMenu.remove();
        });
      $(document)
        .off("click.rightMenuMore")
        .on("click.rightMenuMore", ".rightMenu-item", function (e) {
          if ($(this).hasClass("haveMore")) {
            if (e !== void 0) {
              e.preventDefault();
              e.stopPropagation();
            }
          } else {
            contextMenu.remove();
          }
        });
      $("head").append(
        '<style id="plus-right-menu">' + contextMenu.getCss() + "</style>"
      );
    },
    bind: function (elem, items) {
      $(elem).bind("contextmenu", function (e) {
        contextMenu.show(items, e.clientX, e.clientY, e);
        return false;
      });
    },
    show: function (items, x, y, e) {
      var xy = "left: " + x + "px; top: " + y + "px;";
      var htmlStr = '<div class="rightMenu" style="' + xy + '">';
      htmlStr += contextMenu.getHtml(items, "");
      htmlStr += "   </div>";
      contextMenu.remove();
      $("body").append(htmlStr);
      var $rightMenu = $(".rightMenu");
      if (x + $rightMenu.outerWidth() > contextMenu.getWidth()) {
        x -= $rightMenu.outerWidth();
      }
      if (y + $rightMenu.outerHeight() > contextMenu.getHeight()) {
        y = y - $rightMenu.outerHeight();
        if (y < 0) {
          y = 0;
        }
      }
      $rightMenu.css({ top: y, left: x });
      contextMenu.setEvents(items, e);
      $(".rightMenu-item").on("mouseenter", function (e) {
        e.stopPropagation();
        $(this).parent().find(".rightMenu-sub").css("display", "none");
        if (!$(this).hasClass("haveMore")) return;
        var $item = $(this).find(">a");
        var $sub = $(this).find(">.rightMenu-sub");
        var top = $item.offset().top - $("body,html").scrollTop();
        var left =
          $item.offset().left +
          $item.outerWidth() -
          $("body,html").scrollLeft();
        if (left + $setEventssub.outerWidth() > contextMenu.getWidth()) {
          left = $item.offset().left - $sub.outerWidth();
        }
        if (top + $sub.outerHeight() > contextMenu.getHeight()) {
          top = top - $sub.outerHeight() + $item.outerHeight();
          if (top < 0) {
            top = 0;
          }
        }
        $(this).find(">.rightMenu-sub").css({
          top: top,
          left: left,
          display: "block",
        });
      }) /*.on('mouseleave', function () {
                $(this).find('>.rightMenu-sub').css('display', 'none');
            })*/;
    },
    remove: function () {
      var ifs = parent.window.frames;
      for (var i = 0; i < ifs.length; i++) {
        var tif = ifs[i];
        try {
          tif.layui.jquery("body>.rightMenu").remove();
        } catch (e) {}
      }
      try {
        parent.layui.jquery("body>.rightMenu").remove();
      } catch (e) {}
    },
    setEvents: function (items, event) {
      $(".rightMenu")
        .off("click")
        .on("click", "[lay-id]", function (e) {
          var itemId = $(this).attr("lay-id");
          var item = getItemById(itemId, items);
          item.click && item.click(e, event);
        });

      function getItemById(id, list) {
        for (var i = 0; i < list.length; i++) {
          var one = list[i];
          if (id == one.itemId) {
            return one;
          } else if (one.subs && one.subs.length > 0) {
            var temp = getItemById(id, one.subs);
            if (temp) {
              return temp;
            }
          }
        }
      }
    },
    getHtml: function (items, pid) {
      var htmlStr = "";
      for (var i = 0; i < items.length; i++) {
        var item = items[i];
        item.itemId = "rightMenu-" + pid + i;
        if (item.subs && item.subs.length > 0) {
          htmlStr +=
            '<div class="rightMenu-item haveMore" lay-id="' +
            item.itemId +
            '">';
          htmlStr += "<a>";
          if (item.icon) {
            htmlStr += item.icon + " ";
          }
          htmlStr += item.name;
          htmlStr += '<i class="layui-icon layui-icon-right icon-more"></i>';
          htmlStr += "</a>";
          htmlStr += '<div class="rightMenu-sub" style="display: none;">';
          htmlStr += contextMenu.getHtml(item.subs, pid + i);
          htmlStr += "</div>";
        } else {
          htmlStr +=
            '<div class="rightMenu-item" lay-id="' + item.itemId + '">';
          htmlStr += "<a>";
          if (item.icon) {
            htmlStr += item.icon + " ";
          }
          htmlStr += item.name;
          htmlStr += "</a>";
        }
        htmlStr += "</div>";
        if (item.hr == true) {
          htmlStr += "<hr/>";
        }
      }
      return htmlStr;
    },
    getCss: function () {
      var cssStr = ".rightMenu, .rightMenu-sub {";
      cssStr += "        max-width: 250px;";
      cssStr += "        min-width: 80px;";
      cssStr += "        background: white;";
      cssStr += "        border-radius: 8px;";
      cssStr += "        padding: 3px;";
      cssStr += "        white-space: nowrap;";
      cssStr += "        position: fixed;";
      cssStr += "        z-index: 1003;";
      cssStr += "        box-shadow: 0 2px 4px rgba(0, 0, 0, .12);";
      cssStr += "        border: 1px solid #d2d2d2;";
      cssStr += "        overflow: visible;";
      cssStr += "   }";

      cssStr += "   .rightMenu-item {";
      cssStr += "        position: relative;";
      cssStr += "   }";

      cssStr += "   .rightMenu-item > a {";
      cssStr += "        font-size: 12px;";
      cssStr += "        color: #666;";
      cssStr += "        padding:0 5px;";
      cssStr += "        cursor: pointer;";
      cssStr += "        display: block;";
      cssStr += "        line-height: 32px;";
      cssStr += "        text-decoration: none;";
      cssStr += "        position: relative;";
      cssStr += "   }";

      cssStr += "   .rightMenu-item > a:hover {";
      cssStr += "        background: #dfe1e6;";
      cssStr += "        color: #666;";
      cssStr += "        border-radius: 4px;";
      cssStr += "   }";

      cssStr += "   .rightMenu-item > a > .icon-more {";
      cssStr += "        position: absolute;";
      cssStr += "        right: 5px;";
      cssStr += "        top: 0;";
      cssStr += "        font-size: 12px;";
      cssStr += "        color: #666;";
      cssStr += "   }";

      cssStr += "   .rightMenu-item > a > .ctx-icon {";
      cssStr += "        position: absolute;";
      cssStr += "        left: 5px;";
      cssStr += "        top: 0;";
      cssStr += "        font-size: 15px;";
      cssStr += "        color: #666;";
      cssStr += "   }";

      cssStr += "   .rightMenu hr {";
      cssStr += "        background-color: #e6e6e6;";
      cssStr += "        clear: both;";
      cssStr += "        margin: 5px 0;";
      cssStr += "        border: 0;";
      cssStr += "        height: 1px;";
      cssStr += "   }";

      cssStr += "   .ctx-ic-lg {";
      cssStr += "        font-size: 15px !important;";
      cssStr += "        left: 5px !important;";
      cssStr += "    }";
      return cssStr;
    },
    getHeight: function () {
      return (
        document.documentElement.clientHeight || document.body.clientHeight
      );
    },
    getWidth: function () {
      return document.documentElement.clientWidth || document.body.clientWidth;
    },
  };
  contextMenu.init();
  exports("contextMenu", contextMenu);
});
